<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ExamStack</title>
<#--<meta name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="keywords" content="">-->
    <!--<link rel="shortcut icon" href="http://localhost:8080/Portal/../resources/images/favicon.ico" />-->
    <link href="resources/bootstrap/css/bootstrap-huan.css"
          rel="stylesheet">
    <link href="resources/font-awesome/css/font-awesome.min.css"
          rel="stylesheet">
    <link href="resources/css/style.css" rel="stylesheet">

    <!-- jQuery -->
    <script type="text/javascript" src="resources/js/jquery/jquery-1.9.0.min.js "></script>
    <!-- Bootstrap JS -->
    <script type="text/javascript" src="resources/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="/static/vue/vue.js"></script>
    <script type="text/javascript" src="/static/vue/date.js"></script>
    <style>
        .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
            padding: 8px 0;
            line-height: 1.42857143;
            vertical-align: middle;
            border-top: 1px solid #ddd;
        }

        a.join-practice-btn {
            margin-top: 0;
        }
    </style>

</head>

<body>
<header>
    <div class="container">
        <div class="row">
            <div class="col-xs-5">
                <div class="logo">
                    <h1><a href="#"><img alt="" src="resources/images/logo.png"></a></h1>
                </div>
            </div>
            <div class="col-xs-7" id="login-info">
            <#--<c:choose>-->
            <#--<c:when test="&lt;#&ndash;${not empty sessionScope.SPRING_SECURITY_CONTEXT.authentication.principal.username}&ndash;&gt;">-->
            <#--<div id="login-info-user">-->
            <#---->
            <#--<a href="user-detail/&lt;#&ndash;${sessionScope.SPRING_SECURITY_CONTEXT.authentication.principal.username}&ndash;&gt;" id="system-info-account" target="_blank">&lt;#&ndash;${sessionScope.SPRING_SECURITY_CONTEXT.authentication.principal.username}&ndash;&gt;</a>-->
            <#--<span>|</span>-->
            <#--<a href="j_spring_security_logout"><i class="fa fa-sign-out"></i> 退出</a>-->
            <#--</div>-->
            <#--</c:when>-->
            <#--<c:otherwise>-->
            <#--<a class="btn btn-primary" href="user-register">用户注册</a>-->
            <#--<a class="btn btn-success" href="user-login-page">登录</a>-->
            <#--</c:otherwise>-->
            <#--</c:choose>-->
            </div>
        </div>
    </div>
</header>
<!-- Navigation bar starts -->

<div class="navbar bs-docs-nav" role="banner">
    <div class="container">
        <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">
            <ul class="nav navbar-nav">
                <li>
                    <a href="home"><i class="fa fa-home"></i>主页</a>
                </li>
                <li>
                    <a href="student/practice-list"><i class="fa fa-edit"></i>试题练习</a>
                </li>
                <li class="active">
                    <a href="exam-list"><i class="fa  fa-paper-plane-o"></i>在线考试</a>
                </li>
                <li>
                    <a href="training-list"><i class="fa fa-book"></i>培训资料</a>
                </li>
                <li>
                    <a href="student/usercenter"><i class="fa fa-dashboard"></i>会员中心</a>
                </li>
                <li>
                    <a href="student/setting"><i class="fa fa-cogs"></i>个人设置</a>
                </li>
            </ul>
        </nav>
    </div>
</div>

<!-- Navigation bar ends -->

<!-- Slider starts -->
<div id="app" class="content" style="margin-bottom: 100px;">

    <div class="container" style="margin-top: 40px;">

        <div class="row">
            <div class="col-xs-6">
                <div style="border-bottom: 1px solid #ddd;">
                    <h3 class="title"><i class="fa fa-cloud-upload"></i> 最近发布的考试</h3>

                </div>

                <div class="question-list">

                    <table class="table-striped table">
                        <thead>

                        <tr>
                            <td>考试名称</td>
                            <td>开始日期</td>
                            <td>截止日期</td>
                            <td></td>
                        </tr>
                        </thead>
                        <tbody>
                        <tr v-for="(item,index) in all">
                            <td>{{item.examName}}</td>
                            <td><span class="span-info question-number">{{item.startTime| DateFilter}}</span></td>
                            <td><span class="span-success question-number-2">{{item.endTime | DateFilter}}</span></td>
                            <td>

                                <a @click="apply(item.id)" class="btn btn-success btn-sm join-practice-btn">申请</a>
                            </td>
                        </tbody>
                        <tfoot></tfoot>
                    </table>


                </div>
            </div>
            <div class="col-xs-6">
                <div style="border-bottom: 1px solid #ddd;">
                    <h3 class="title"><i class="fa fa-paper-plane-o"></i> 我的考试</h3>

                </div>
                <div class="question-list">
                    <table class="table-striped table">
                        <thead>

                        <tr>
                            <td>考试名称</td>
                            <td>开始日期</td>
                            <td>截止日期</td>
                            <td></td>
                        </tr>
                        </thead>
                        <tbody>

                        <tr v-for="(item,index) in curruser">
                            <td>{{item.exam_name}}</td>
                            <td><span class="span-info question-number">{{item.start_time | DateFilter}}</span></td>
                            <td><span class="span-success question-number-2">{{item.end_time | DateFilter}}</span></td>
                            <td><#--{{item.approved}}-->
                                <div v-if="item.state===0">
                                    <a class="btn btn-warning btn-sm join-practice-btn">待审核</a>
                                </div>
                                <div v-else-if="item.state===1">
                                    <form action="/ExamPage/toShowExamPaper" method="post">
                                        <input type="hidden" name="examId" v-bind:value="item.id">
                                        <input type="hidden" name="examPaperId" v-bind:value="item.exam_paper_id">
                                        <button  type="submit" class="btn btn-success btn-sm join-practice-btn">参加考试</button>
                                    </form>
                                </div>
                                <div v-else-if="item.state===2">
                                   <a
                                       class="btn btn-danger btn-sm join-practice-btn">考试结束</a>
                                </div>
                        </tr>
                        </tbody>
                        <tfoot></tfoot>
                    </table>

                </div>
                <div style="border-bottom: 1px solid #ddd;">
                    <h3 class="title"><i class="fa fa-paper-plane-o"></i> 模拟考试</h3>

                </div>
                <div class="question-list">

                    <table class="table-striped table">
                        <thead>

                        <tr>
                            <td>考试名称</td>
                            <td>开始日期</td>
                            <td>截止日期</td>
                            <td></td>
                        </tr>
                        </thead>
                        <tbody>

                        <tr v-for="(item,index) in simulate">

                            <td>{{item.examName }}</td>
                            <td><span class="span-info question-number">{{item.startTime| DateFilter}}</span>
                            </td>
                            <td><span class="span-success question-number-2">{{item.endTime| DateFilter}}</span></td>
                            <td>
                                <form action="/ExamPage/toShowExamPaper" method="post">
                                    <input type="hidden" name="examId" v-bind:value="item.id">
                                    <input type="hidden" name="examPaperId" v-bind:value="item.examPaperId">
                                    <button  type="submit" class="btn btn-success btn-sm join-practice-btn">参加考试</button>
                                </form>
                            </td>
                        </tr>

                        </tbody>
                        <tfoot></tfoot>
                    </table>

                </div>
            </div>

        </div>


    </div>

</div>

<footer>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="copy">
                    <p>
                        ExamStack Copyright © <a href="http://www.examstack.com/" target="_blank">ExamStack</a> - <a
                            href="resources" target="_blank">主页</a> | <a href="http://www.examstack.com/"
                                                                         target="_blank">关于我们</a> | <a
                            href="http://www.examstack.com/" target="_blank">FAQ</a> | <a
                            href="http://www.examstack.com/" target="_blank">联系我们</a>
                    </p>
                </div>
            </div>
        </div>

    </div>

</footer>
</body>
</html>
<script>
    Vue.filter("DateFilter", function (date) {
        var v = new Date(date);
        return formatDate(v, "yyyy-MM-dd HH:mm:ss");
    });

    var vm = new Vue({
        el: '#app',
        data: {
            all: [],
            curruser: [],
            simulate: []
        }
    });
    $(function () {
        a();
        b();
        c();
        //d();
    });

    function a() {
        $.ajax({
            type: 'post',
            url: "/getapplytest",
            dataType: "json",
            success: function (data) {
                console.log(data);
                vm.all = data;
            }, error: function () {

            }
        });
    }

    function b() {
        $.ajax({
            type: 'post',
            url: "/getCurrUserExam",
            dataType: "json",
            success: function (data) {
                console.log(data);
                vm.curruser = data;
            }, error: function () {
                alert("cuowu")
            }
        });
    }

    function c() {
        $.ajax({
            type: 'post',
            url: "/getAllSimulate",
            dataType: "json",
            success: function (data) {
                console.log(data);
                vm.simulate = data;
            }, error: function () {

            }
        });
    }

    var apply = function (id) {
        $.ajax({
            type:"POST",
            url:"/addApply",
            data:{
                examId : id
            },
            success:function (data) {
                if(data > 0){
                    a();
                    b();
                    c();
                    alert("申请成功");
                }else {
                    alert("失败")
                }
            },error:function () {
                alert("异常");
            }
        });
    };

</script>
